<!-- 项目详情 -->
<template>
	<view class="pageMain u-skeleton page-content">
		<view class="scroll-Y pagebt75">
			<view class="topBox px-3" :style="{ paddingTop: statusBarHeight }">
				<view class="nav d-flex px-4 a-center font-lg text-light" :style="{ height: navBarHeight }"></view>
				<view class="d-flex a-center ">
					<view class="logoBox text-main font-md iconfont icon-back" @click="backFn"></view>
					<view class="logoBox text-main font-md flex-1 text-c">企业信息修改</view>
				</view>
				<view class="logoBox ">
					<view class="bg-write p-3 rounded-8">
						<view class="text-main font-md pb-1">拒绝理由</view>
						<view class="text-main font line-h-md">{{ companyFormData.companyOffReason }}</view>
					</view>
				</view>
			</view>
			<view class="px-3 mt-3">
				<view class="bg-write px-3">
					<view class="pt-3 font-md text-main">企业基本信息</view>
					<u-form class="formBox" :model="companyFormData" ref="companyForm">
						<view class="form">
							<u-form-item
								class="required companyNameScroll"
								label="公司名称"
								label-position="top"
								:border-bottom="false"
							>
								<u-input
									border
									height="80"
									v-model="companyFormData.companyName"
									placeholder="请输入公司名称"
									:disabled="disably"
								/>
							</u-form-item>
							<u-form-item
								class="required companyCardTypeScroll"
								label="证件类型"
								label-position="top"
								:border-bottom="false"
							>
								<hpy-form-select
									:dataList="certificateTypeList"
									text="name"
									name="dictId"
									v-model="companyFormData.companyCardTypeId"
									@change="queryVompanyCardTypeName"
									title="请选择证件类型"
									hideBorder
									:disabled="disably"
								/>
							</u-form-item>
							<u-form-item
								class="required companyCardNumberScroll"
								label="证件号码"
								label-position="top"
								:border-bottom="false"
							>
								<u-input
									border
									height="80"
									v-model="companyFormData.companyCardNumber"
									placeholder="请输入证件号码"
									:disabled="disably"
								/>
							</u-form-item>
							<u-form-item
								class="required companyAddressScroll"
								label="注册地址"
								label-position="top"
								:border-bottom="false"
							>
								<u-input
									border
									height="80"
									v-model="companyFormData.companyAddress"
									placeholder="请输入注册地址"
									:disabled="disably"
								/>
							</u-form-item>
							<u-form-item
								class="required businessRangeScroll"
								label="业务范围"
								label-position="top"
								:border-bottom="false"
							>
								<u-input
									border
									height="80"
									v-model="companyFormData.businessRange"
									placeholder="请输入业务范围"
									:disabled="disably"
								/>
							</u-form-item>
							<u-form-item
								class="required companyIdFileScroll"
								label="上传证件照片"
								label-position="top"
								:border-bottom="false"
							>
								<image-upload
									:dataType="1"
									name="file"
									:remove="!disably"
									:headers="header"
									:action="uploadFileUrl"
									v-model="companyFormData.companyIdFiles"
									:compress="true"
									:quality="60"
									mediaType="image"
									:add="!disably"
									@uploadSuccess="uploadcompanyIdFilesFn"
								></image-upload>
							</u-form-item>
							<u-form-item
								class="required parentNameScroll"
								label="上级组织"
								label-position="top"
								:border-bottom="false"
							>
								<u-input
									border
									height="80"
									v-model="companyFormData.parentName"
									@click="queryOrganizationFn"
									placeholder="请选择上级组织"
									:disabled="disably"
								/>
								<text
									class="iconfont icon-xiajiantou u-p-r-10 u-font-28 text-tips"
									style="position:absolute;right:74rpx;"
								></text>
							</u-form-item>
						</view>
						<view class="pt-3 font-md text-main">企业服务能力</view>
						<view>
							<u-form-item
								class="required companyServiceTypeListScroll"
								label="产业标记"
								label-position="top"
								:border-bottom="false"
							>
								<uni-data-checkbox
									multiple
									v-model="serviceType"
									:localdata="industrialMarkList"
									@change="queryCompanyServiceTypeFn"
									:disabled="disably"
								></uni-data-checkbox>
							</u-form-item>
							<u-form-item
								class="required companyServiceAreaListNameScroll"
								label="服务地区"
								label-position="top"
								:border-bottom="false"
							>
								<view class="d-flex flex-wrap">
									<view
										class="py px-2 bg-primary rounded-8 mr-2 mb-1 text-primary"
										v-for="(item, index) in serviceArea"
										:key="index"
									>
										{{ item.provinceName }} {{ item.cityName }}
										<text
											class="pl-1 iconfont icon-shanchu text-error"
											@click="delCityFn(index)"
											v-if="!disably"
										></text>
									</view>
									<view
										class="py px-2 bg-primary rounded-8 mr-2 mb-1 text-primary"
										@click="addCityFn()"
										v-if="!disably"
									>
										<text class=" pr-2 iconfont icon-jia text-primary" @click="addCityFn()"></text>
										添加城市
									</view>
								</view>
							</u-form-item>
						</view>
						<view class="pt-3 font-md font-weight">企业资质</view>
						<view class="form">
							<u-form-item
								class="required companyAptitudeListScroll"
								label="上传资质"
								label-position="top"
								:border-bottom="false"
							>
								<view
									class="d-flex bg-primary px-2   j-center  rounded-8 w-100 text-primary border-light upBox"
									@click="uploadPualificationFn"
									v-if="!disably"
								>
									上传
								</view>
							</u-form-item>
							<view
								class="d-flex mb-1 bg-grey p-2 rounded-8 a-center position-relative "
								v-for="(item, index) in companyFormData.companyAptitudeFiles"
								:key="index"
							>
								<view>
									<image
										class="u-skeleton-circle imagesBox"
										style="width: 140rpx; height: 140rpx; border-radius: 0;"
										:src="http.config.baseURL + item.files[0].filePreviewUrl"
									></image>
								</view>
								<view class="p-2 flex-1">
									<view class="font-weight font-sm ">{{ item.companyAptitudeName }}</view>
									<view class="font-weight font-sm p">{{ item.lv }}</view>
									<view class="font text-tips p">有效期截止日期：{{ item.validEndDate }}</view>
								</view>

								<text
									class="pl-1 iconfont icon-shanchu text-error position-absolute top-2 right-2 "
									@click="delAptitudeFn(index)"
									v-if="!disably"
								></text>
							</view>
						</view>
						<view class="pt-3 font-md font-weight">企业收益规则</view>
						<view class="form">
							<u-form-item label="收益规则" label-position="top" :border-bottom="false">
								<u-input
									border
									height="80"
									type="number"
									v-model="companyFormData.companyDivideIntoRuleValue"
									placeholder="请输入收益规则"
									:disabled="disably"
								/>
							</u-form-item>
							<u-form-item label="上传规则说明" label-position="top" :border-bottom="false">
								<image-upload
									:dataType="1"
									name="file"
									:remove="!disably"
									:headers="header"
									:action="uploadFileUrl"
									v-model="companyFormData.companyRuleFiles"
									:compress="true"
									:quality="60"
									mediaType="image"
									:add="!disably"
									@uploadSuccess="uploadCompanyDivideIntoRuleFn"
								></image-upload>
							</u-form-item>
						</view>
					</u-form>
				</view>
			</view>
		</view>
		<view class="subarea">
			<button class="primaryBnt btn-fill font-weight-100" v-if="disably" :disabled="true">审核中</button>
			<button class="primaryBnt btn-fill font-weight-100" @click="hanglgSubmitFn" v-else>修 改</button>
		</view>
		<organization ref="organization" @confirom="queryCorpanyFn"></organization>
		<cascader
			v-if="show"
			ref="cascader"
			:cascaderData="cascaderData"
			:selectValue.sync="serviceAreaId"
			@confirem="cascaderConfirem"
		></cascader>
		<qualification ref="qualification" @confiromQualificationFn="queryQualificationFn"></qualification>
	</view>
</template>

<script>
import { getDictByParentId, uploadUrl, myCompanyInfo, updateCompanyInfo } from '@/api/apis.js';
import uniDataCheckbox from '@/userPages/components/uni-data-checkbox/uni-data-checkbox.vue';
import organization from '@/userPages/components/organization.vue';
import cascader from '@/userPages/components/cascader.vue';
import qualification from '@/userPages/components/qualification.vue';
import { cascaderData } from '@/utils/provincesData.js';
import { http } from '@/api/service.js';
export default {
	components: {
		uniDataCheckbox,
		organization,
		cascader,
		qualification
	},
	data() {
		return {
			http,
			statusBarHeight: '',
			navBarHeight: '',
			cascaderData,
			certificateTypeList: [],
			industrialMarkList: [],
			serviceType: [],
			serviceArea: [],
			serviceAreaId: [],
			uploadFileUrl: uploadUrl,
			header: {
				token: uni.getStorageSync('ims-token')
			},
			companyFormData: {},
			show: false,
			disably: false
		};
	},
	onLoad() {
		/*#ifdef MP*/
		let that = this;
		uni.getSystemInfo({
			success: function(info) {
				// 屏幕高度
				let screenHeight = info.screenHeight;
				// 屏幕宽度
				let screenWidth = info.screenWidth;
				// 胶囊高度
				//状态栏高度
				that.statusBarHeight = info.statusBarHeight * 2 + 'rpx';
				let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
				let navBarHeight = menuButtonInfo.bottom + menuButtonInfo.top - screenHeight;
				that.navBarHeight = navBarHeight + screenHeight - info.statusBarHeight + 'rpx';
			}
		});
		/*#endif*/
		this.getDictFn();
		this.industrialMarkFn();
		this.myCompanyInfoFn();
	},
	methods: {
		//获取我的企业信息
		myCompanyInfoFn() {
			myCompanyInfo({}).then(res => {
				if (res.code == 10000) {
					const isRequired = key =>
						[
							'companyId',
							'companyName',
							'companyCardTypeName',
							'companyCardTypeId',
							'companyCardNumber',
							'companyAddress',
							'companyIdFiles',
							'businessRange',
							'parentId',
							'parentName',
							'serviceType',
							'serviceArea',
							'companyAptitudeFiles',
							'companyDivideIntoRuleValue',
							'companyBaseOffReason',
							'companyOffReason',
							'companyRuleFiles',
							'status',
							'auditStatus'
						].includes(key);
					// 筛选详情
					this.companyFormData = Object.keys(res.data)
						.filter(isRequired)
						.reduce((obj, key) => {
							obj[key] = res.data[key];
							return obj;
						}, {});
					this.serviceType = this.companyFormData.serviceType.map(item => {
						return item.serviceTypeId;
					});
					this.serviceArea = res.data.serviceArea.map(({ cityName, provinceName }) => ({
						cityName,
						provinceName
					}));
					this.serviceAreaId = res.data.serviceArea.map(({ cityCode, provinceCode }) => ({
						cityCode,
						provinceCode
					}));
					this.serviceArea.forEach(obj => {
						if (obj.cityName == '全部') {
							obj.cityName = ' ';
						}
					});
					this.serviceAreaId.forEach(obj => {
						if (obj.cityCode == '') {
							obj.cityCode = obj.provinceCode + '_';
						} else if (obj.cityCode == obj.provinceCode) {
							obj.cityCode += '_';
						}
					});
					this.show = true;
					if (this.companyFormData.auditStatus == 'UnderReview') {
						this.disably = true;
					}
				} else {
					this.$u.toast(res.msg);
				}
			});
		},

		//修改企业信息
		hanglgSubmitFn() {
			if (this.queryCompanyValidRuleFn()) {
				const cleanObject = obj =>
					Object.fromEntries(
						Object.entries(obj).map(([key, value]) => [
							key.replace(/_/g, ''),
							typeof value === 'string' ? value.replace(/_/g, '') : value
						])
					);

				const cleanArray1 = this.serviceAreaId.map(obj => {
					const newObj = {};
					for (const key in obj) {
						if (obj.hasOwnProperty(key)) {
							// 检查属性值是否为字符串且包含下划线
							const value = obj[key];
							newObj[key] = typeof value === 'string' && value.includes('_') ? '' : value;
						}
					}
					return newObj;
				});
				// const cleanArray1 = this.serviceAreaId.map(cleanObject);
				const cleanArray2 = this.serviceArea;

				this.companyFormData.serviceArea = cleanArray2.map((obj1, index) => {
					if (cleanArray1[index]) {
						return { ...obj1, ...cleanArray1[index] };
					}
					return obj1;
				});
				console.log(this.companyFormData.serviceArea, 'dddddddddd');
				updateCompanyInfo({
					status: this.companyFormData.status,
					companyUpdateType: 0,
					...this.companyFormData
				}).then(res => {
					if (res.code == 10000) {
						console.log('修改成功');
						this.$Router.replaceAll({
							path: '/pages/home/index'
						});
					} else {
						this.$u.toast(res.msg);
					}
				});
			}
		},
		//验证码校验
		queryCompanyValidRuleFn() {
			if (this.companyFormData.companyName == '') {
				this.$u.toast('请输入公司名称');
				uni.pageScrollTo({
					selector: '.companyNameScroll',
					duration: 300
				});
				return false;
			}
			if (this.companyFormData.companyCardTypeId == '') {
				this.$u.toast('请选择证件类型');
				uni.pageScrollTo({
					selector: '.companyCardTypeScroll',
					duration: 300
				});
				return false;
			}
			if (this.companyFormData.companyCardNumber == '') {
				this.$u.toast('请输入证件号码');
				uni.pageScrollTo({
					selector: '.companyCardNumberScroll',
					duration: 300
				});
				return false;
			}
			if (this.companyFormData.companyAddress == '') {
				this.$u.toast('请输入注册地址');
				uni.pageScrollTo({
					selector: '.companyAddressScroll',
					duration: 300
				});
				return false;
			}
			if (this.companyFormData.businessRange == '') {
				this.$u.toast('请输入业务范围');
				uni.pageScrollTo({
					selector: '.businessRangeScroll',
					duration: 300
				});
				return false;
			}
			if (!this.companyFormData.companyIdFiles.length) {
				this.$u.toast('请上传证件照片');
				uni.pageScrollTo({
					selector: '.companyIdFileScroll',
					duration: 300
				});
				return false;
			}
			if (this.companyFormData.parentName == '') {
				this.$u.toast('请选择上级组织');
				uni.pageScrollTo({
					selector: '.parentNameScroll',
					duration: 300
				});
				return false;
			}
			if (!this.serviceType.length) {
				this.$u.toast('请选择产业标记');
				uni.pageScrollTo({
					selector: '.companyServiceTypeListScroll',
					duration: 300
				});
				return false;
			}
			if (!this.serviceArea.length) {
				this.$u.toast('请选择服务地区');
				uni.pageScrollTo({
					selector: '.companyServiceAreaListNameScroll',
					duration: 300
				});
				return false;
			}
			if (!this.companyFormData.companyAptitudeFiles.length) {
				this.$u.toast('请添加企业资质');
				uni.pageScrollTo({
					selector: '.companyAptitudeListScroll',
					duration: 300
				});
				return false;
			}

			return true;
		},
		backFn() {
			this.$Router.back();
		},
		//获取上级组织
		queryCorpanyFn(e) {
			this.companyFormData.parentId = e.companyId;
			this.companyFormData.parentName = e.companyName;
		},
		// 获取证件类型
		getDictFn() {
			getDictByParentId({
				parentId: 'COMPANY_CARD_TYPE'
			}).then(res => {
				if (res.code == 10000) {
					this.certificateTypeList = res.data;
				} else {
					this.$u.toast(res.msg);
				}
			});
		},
		//获取产业标记
		industrialMarkFn() {
			getDictByParentId({
				parentId: 'COMPANY_SERVICE'
			}).then(res => {
				if (res.code == 10000) {
					this.industrialMarkList = res.data.map(obj => ({
						...obj,
						['checked']: false,
						['disabled']: false,
						['text']: obj.name,
						['value']: obj.dictId
					}));
				} else {
					this.$u.toast(res.msg);
				}
			});
		},
		//获取上级组织
		queryOrganizationFn() {
			this.$refs.organization.show();
		},
		//获取标记
		queryCompanyServiceTypeFn(e) {
			this.companyFormData.serviceType = [];
			e.detail.data.forEach(x => {
				this.companyFormData.serviceType.push({
					serviceTypeId: x.dictId,
					serviceTypeName: x.name
				});
			});
		},
		//添加城市
		addCityFn() {
			this.$refs.cascader.show();
		},
		//确认城市
		cascaderConfirem(e) {
			e.select_names.forEach(obj => {
				if (obj['cityName'].includes('不限')) {
					obj['cityName'] = obj['cityName'].replace(new RegExp('不限', 'g'), '');
				}
			});
			this.serviceArea = e.select_names;
			this.serviceAreaId = e.select_ids;
		},
		//删除资质
		delAptitudeFn(index) {
			this.companyFormData.companyAptitudeFiles.splice(index, 1);
		},

		//删除城市
		delCityFn(index) {
			this.serviceArea.splice(index, 1);
			this.serviceAreaId.splice(index, 1);
		},
		//上传资质
		uploadPualificationFn() {
			this.$refs.qualification.show();
		},
		//获取企业资质
		queryQualificationFn(e) {
			this.$set(e, 'files', e.fileVo);
			this.companyFormData.companyAptitudeFiles.push(e);
		},
		//上传公司证件照
		uploadcompanyIdFilesFn(res) {
			var _res = JSON.parse(res.data);
			this.companyFormData.companyIdFiles.push({
				fileId: _res.data.fileId,
				fileName: _res.data.fileName,
				fileSize: _res.data.fileSize,
				fileSuffix: _res.data.fileSuffix,
				filePreviewUrl: _res.data.filePreviewUrl,
				fileDownloadUrl: _res.data.fileDownloadUrl
			});
		},
		//上传企业规则文件
		uploadCompanyDivideIntoRuleFn(res) {
			var _res = JSON.parse(res.data);
			this.companyFormData.companyRuleFiles.push({
				fileId: _res.data.fileId,
				fileName: _res.data.fileName,
				fileSize: _res.data.fileSize,
				fileSuffix: _res.data.fileSuffix,
				filePreviewUrl: _res.data.filePreviewUrl,
				fileDownloadUrl: _res.data.fileDownloadUrl
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.pageMain {
	width: 100%;
	height: 100%;
	.topBox {
		background: linear-gradient(180deg, rgba(45, 143, 255, 0.4), rgba(190, 214, 250, 0) 100%);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		.logoBox {
			padding-top: 40rpx;
		}
	}
	.formBox {
		::v-deep .select-picker {
			width: 630rpx !important;
		}
		::v-deep .htz-image-upload-Item {
			width: 620rpx;
		}
	}

	.upBox {
		height: 160rpx;
		line-height: 160rpx;
	}
}
</style>
